import React from 'react'
// import store from './store';
import { connect } from 'react-redux'

// function App() {
//   const msg = store.getState()
//   const changemsg = ()=>{
//     store.dispatch({
//       type:"changemnum",
//       payload:999999
//     })
//     setTimeout(()=>{
//       console.log("修改后的值",msg.msgReducer)
//     },1000)
//   }
//   return (
//     <div className="App">
//      <h1>测试redux --- {msg.msgReducer.msg}</h1>
//      <button onClick={changemsg}>修改redux的值</button>
//     </div>
//   );
// }

function App(props: any) {

  const asyncChangemsg = ()=>{
    return new Promise((resolve)=>{
      setTimeout(()=>{
        resolve("延迟1.5s的数据")
      },1500)
    })
  }
  return (
    <div className="App">
      <h1>测试react-redux ---{props.msg} </h1>
      <button
      onClick={()=>{
        props.changeMsg("修改redux的值")
      }}
      >
        修改redux的值
      </button>
      <br/>
      <button onClick={()=>{
        // asyncChangemsg().then(res=>{
        //   props.changeMsg(res)
        // })
        props.AsyncchangeMsg("延迟1.5s的数据")
      }}>数据请求按钮</button>
    </div>
  )
}
const Reduxapp = connect((state:any)=>{
  return {
    msg:state.msgReducer.msg
  }
},(dispatch)=>{
  return {
    changeMsg(msg:string){
      dispatch({
        type:'changemsg',
        payload:msg
      })
    },
    AsyncchangeMsg(msg:string){
      dispatch({
        type:'asyncchangemsg',
        payload:msg
      })
    },
  }
})(App)


export default Reduxapp
